import React from 'react';
import { Modal as AntdModal } from 'antd';
import type { ModalProps as AntdModalProps } from 'antd';
import { createStyles } from 'antd-style';

export interface ModalProps extends AntdModalProps {
  /**
   * @description 自定义样式类名
   */
  customClassName?: string;
}

const useStyles = createStyles(({ token, css }) => ({
  modal: css`
    .ant-modal-content {
      border-radius: ${token.borderRadius}px;
    }
  `,
}));

const ModalComponent: React.FC<ModalProps> = ({ customClassName, className, ...restProps }) => {
  const { styles, cx } = useStyles();
  
  const modalClassName = cx(
    className,
    customClassName,
    styles.modal
  );

  return <AntdModal className={modalClassName} {...restProps} />;
};

const Modal = Object.assign(ModalComponent, {
  useModal: AntdModal.useModal,
  info: AntdModal.info,
  success: AntdModal.success,
  error: AntdModal.error,
  warning: AntdModal.warning,
  confirm: AntdModal.confirm,
  destroyAll: AntdModal.destroyAll,
  _InternalPanelDoNotUseOrYouWillBeFired: AntdModal._InternalPanelDoNotUseOrYouWillBeFired,
});

export { Modal };
export default Modal;

